<template>
  <div>
    <el-table
      v-loading="tableDataLoading"
      :data="tableData">
      <el-table-column
        fixed
        prop="id"
        label="ID"
        width="80">
      </el-table-column>
      <el-table-column
        prop="userId"
        label="会员编号">
        <template slot-scope="scope">
          <span style="color: #4f9dec;cursor: pointer;">{{scope.row.userId}}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="classify"
        label="直属">
        <template slot-scope="scope">
          <span style="color: #4f9dec;cursor: pointer;">{{scope.row.classify==1?'直属':scope.row.classify==2?'非直属':''}}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="money"
        label="充值金额">
      </el-table-column>
      <el-table-column
        prop="title"
        label="充值标题">
      </el-table-column>
      <el-table-column
        prop="content"
        label="充值内容">
      </el-table-column>
      <el-table-column
        prop="createTime"
        label="创建时间"
        width="160">
      </el-table-column>
    </el-table>
    <div style="text-align: center;margin-top: 10px;">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[5, 10, 15 , 20]"
        :page-size="size"
        :current-page="page"
        layout="total,sizes, prev, pager, next"
        :total="totalnum">
      </el-pagination>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'AgentOpening',
    data () {
      return {
        tableDataLoading: true,
        tableData: [],
        page: 0,
        size: 10,
        totalnum: 0
      }
    },
    methods: {
      handleSizeChange (val) {
        this.size = val
        this.dataSelect()
      },
      handleCurrentChange (val) {
        this.page = val
        this.dataSelect()
      },
      // 获取数据列表
      dataSelect () {
        this.tableDataLoading = true
        this.$http({
          url: this.$http.adornUrl2(`/userMoney/memberRecord/`),
          method: 'get',
          params: this.$http.adornParams({
            page: this.page,
            size: this.size,
            type: 20
          })
        }).then(({data}) => {
          this.tableDataLoading = false
          let returnData = data.data
          this.tableData = returnData.content
          this.totalnum = returnData.totalElements
        })
      }
    },
    mounted () {
      this.dataSelect()
    }
  }
</script>

<style lang="scss" scoped>

</style>
